import { defineStore } from "pinia";
import { getToken, removeToken, setToken } from "../utils/token-utils";
import type { UserInfoState } from "./interface";
import { ElMessage } from "element-plus";
import { staticRoutes } from "@/router/routes"; // 从路由中引入了“静态路由”
import { loginApi, getUserInfoApi, logoutApi } from "@/api/acl/user";

/**
 * 用户信息
 * @methods setUserInfos 设置用户信息
 */
export const useUserInfoStore = defineStore("userInfo", {
  state: (): UserInfoState => ({
    token: getToken() as string,
    name: "",
    avatar: "",
    menuRoutes: [], // 从路由中引入了“静态路由”
  }),

  actions: {
    // 用户登录操作
    async login(username: string, password: string) {
      const { token } = await loginApi(username, password);
      // 回顾上一节课的token做的工作有：1）修改state，2）放到本地存储中，3）利用reslove进行promise的返回
      // 当前我们有没有Promise？没有
      this.token = token; // 修改state的token状态值
      setToken(token); // 将token放置到本地存储当中
    },

    // 获取用户信息
    async getInfo() {
      const result = await getUserInfoApi();
      this.name = result.name; // 设置姓名
      this.avatar = result.avatar; // 设置头像
      // 路由和菜单是有关联的
      this.menuRoutes = staticRoutes; // 将静态路由设置到menuRoutes(菜单路由)中
    },

    async reset() {
      await logoutApi(); // 退出登录
      // 删除local中保存的token
      removeToken();
      // 提交重置用户信息的mutation
      this.token = "";
      this.name = "";
      this.avatar = "";
    },
  },
});
